<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	template="/templates/masterPage.xhtml">

	<ui:define name="pageHeader">
		<div>
			<h1>User management</h1>
		</div>
	</ui:define>

	<ui:define name="content">
		<div>
			<h:form id="form">
				<p:toolbar id="commands">
					<p:toolbarGroup>
						<p:commandButton title="Authentication data" icon="ui-icon ui-icon-extlink" />
						<p:commandButton title="Authentication history" icon="ui-icon ui-icon-note" />
						<p:separator/>
						<p:commandButton title="Block user" icon="ui-icon ui-icon-locked" />
						<p:commandButton title="Unblock user" icon="ui-icon ui-icon-unlocked" />
						<p:commandButton title="Delete user" icon="ui-icon ui-icon-close" />
					</p:toolbarGroup>
				</p:toolbar>
				<h:outputText id="selectedUserTxt" value="#{usersBean.selectedUser.firstName}"/>
				<p:dataTable id="usersList" var="user" value="#{usersBean.users}" rowKey="#{user.id}" 
					selectionMode="single" selection="#{usersBean.selectedUser}"
					rowStyleClass="#{user.isDisabled ? 'disabled_user' : null}">
					
					<p:column headerText="ID">
						<h:outputText value="#{user.id}" />
					</p:column>
					
					<p:column headerText="First Name">
						<h:outputText value="#{user.firstName}" />
					</p:column>
					
					<p:column headerText="Last Name">
						<h:outputText value="#{user.lastName}" />
					</p:column>
					
					<p:column headerText="Is Deleted">
						<h:outputText value="#{user.isDeleted}" />
					</p:column>
					
					<p:column headerText="Is Disabled">
						<h:outputText value="#{user.isDisabled}" />
					</p:column>
				</p:dataTable>
			</h:form>
		</div>
	</ui:define>

	<ui:define name="footer">
		<div />
	</ui:define>
</ui:composition>